import { GetGroupTreeList, DatasetListItem } from '@/common';
import BreadCrumb from '../BreadCrumb';
import { useEffect, useState } from 'react';
import { ItemType } from 'antd/es/breadcrumb/Breadcrumb';
import ApiListTableMain from '../ApiListTableMain';

interface Props {
  selectedItem: DatasetListItem | undefined;
  datasets: DatasetListItem[];
  onItemClicked?: (item: DatasetListItem | undefined) => void;
  handlePageChange?: (page: number, pageSize: number) => void;
  isAdmin: boolean;
  isPermit: boolean;
  loading: boolean;
  groupId: string | undefined;
  managers: any;
  approves: any;
  total: number;
  pageSize: number;
  page: number;
  searchValue?: string;
  setSearchValue?: (value: string) => void;
}

const ApiDetail = ({
  selectedItem,
  datasets,
  isAdmin,
  isPermit,
  loading,
  groupId,
  managers,
  approves,
  total,
  pageSize,
  page,
  searchValue,
  setSearchValue,
  onItemClicked,
  handlePageChange,
}: Props) => {
  return (
    <>
      <div className="flex h-full w-full flex-col">
        <ApiListTableMain
          loading={loading}
          datasets={datasets}
          groupId={groupId}
          managers={managers}
          approves={approves}
          isAdmin={isAdmin}
          isPermit={isPermit}
          selectedItem={selectedItem}
          total={total}
          pageSize={pageSize}
          page={page}
          searchValue={searchValue}
          setSearchValue={setSearchValue}
          onItemClicked={onItemClicked}
          handlePageChange={handlePageChange}
        />
      </div>
    </>
  );
};

export default ApiDetail;
